<template>
  <div>
    <el-button @click="printHandler">打印</el-button>
    <hr></hr>
    <div style="padding-top: 10px;">当前页码:{{ currentPage }}/{{ pageCount }}</div>
    <!-- <pdf 
      v-for="i in numPages"
      :key="i"
      :src="src"
      :page="i"
      style="display: inline-block; width:25%"
    >
  </pdf> -->
  <!--分页展示-->
  <!--分页器-->
  <Pagination :total="total" :pageSize="pageSize" @CurrentChange="CurrentChange"></Pagination>
  <pdf 
      :src="src"
      :page="page"
      ref="pdf"
    >
  </pdf>
  <iframe id="printIframe" :src="iframesrc" frameborder="0" style="display:none"></iframe>
  </div>
</template>

<script>
import pdf from "vue-pdf";
import Pagination from '@/components/pagination/Pagination.vue'
var loadingTask = pdf.createLoadingTask("/1.pdf");
export default {
  components: {
    pdf,Pagination
  },
  mounted() {
    this.src.promise.then((pdf) => {
      this.numPages = pdf.numPages;
      this.total=pdf.numPages;
    });
  },
  data() {
    return {
      currentPage: 0,
      pageCount: 0,
      src: loadingTask,
      numPages: undefined,
      page:1,
      total:'',
      pageSize:1,
      iframesrc:this.$route.query.src
    };
  },
  methods: {
    
    CurrentChange(page){
      this.page=page
    },
    //打印pdf
    printHandler() {
      //this.$refs.pdf.print();
      document.getElementById('printIframe').contentWindow.print();
    },
  },
};
</script>
    
<style>
</style>